<template>
  <div class="document-manager-wapper">
    <van-nav-bar
      title="仓库区域图"
      left-text="返回"
      left-arrow
      fixed
      @click-left="onClickLeft"
      @click-right="onClickRight"
    >
      <van-icon name="arrow-left" slot="left" />
      <!--<van-icon name="search" slot="left"/>-->
      <!-- <span slot="right">
                <van-button type="primary" size="small">移库</van-button>
            </span> -->
    </van-nav-bar>
    <div class="document-content" ref="content">
      <Map :TransferFlag.sync="transferFlag"></Map>
    </div>
  </div>
</template>

<script>
import { wareList } from "../../assets/json/warehouse";
import { Dialog } from "vant";
export default {
  name: "InstructionInfoList",
  components: {
    Map: () => import("./component/Map.vue")
  },
  data() {
    return {
      list: wareList,
      loading: false,
      finished: false,
      transferFlag: 0
    };
  },
  methods: {
    onClickLeft() {
      console.log("onClickLeft");
      // this.$router.back(-1);
      this.$router.push({
        path: "/home"
      });
    },
    onClickRight() {
      console.log("onClickRight");
      this.transferFlag = 1;
    },
    showInfo(id) {
      this.$router.push({
        path: "/order/info",
        query: {
          id: id
        }
      });
    },
    showInstructionInfo(id) {
      this.$router.push({
        path: "/order/info",
        query: {
          id: id
        }
      });
    },
    showAVG() {
      this.$router.push({
        path: "/order/info/avg"
        // query: {
        //      id: id
        //  }
      });
    }
  },
  mounted() {
    const wrap = this.$refs.content;
    console.log(wrap.clientWidth);
    if (wrap.clientWidth > 380) {
      wrap.style.setProperty("--n", 3);
    } else {
      wrap.style.setProperty("--n", 1);
    }
    // let inLenght = wrap.children.length;
  },
  created() {
    if (this.$route.query.value1 != null) {
      this.value1 = this.$route.query.value1;
      this.transferFlag = 1;
    }
    if (this.$route.query.value2 != null) {
      this.value2 = this.$route.query.value2;
      this.transferFlag = 1;
    }
  }
};
</script>

<style scoped lang="scss">
.document-manager-wapper {
  position: relative;
  .document-content {
    position: relative;
    top: 46px;
    height: calc(100%);
    display: flex;
    justify-items: center;
    align-items: center;
  }
}
</style>
